<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0; }

body {
  overflow: auto;
  position: relative;
  background: #000;
  font-family: "Microsoft YaHei"; }
  body.mobile-body {
    min-width: auto; }

video::-internal-media-controls-download-button {
  display: none; }

video::-webkit-media-controls-enclosure {
  overflow: hidden; }

video::-webkit-media-controls-panel {
  width: calc(100% + 39px); }

@media screen and (max-width: 450px) {
  body {
    min-width: auto; }
    body .bottom &gt; .nav-menu {
      display: block; }
    body .reply-wrap .reply-info {
      width: 280px;
      height: 80px;
      position: fixed;
      font-size: 16px;
      margin-left: -140px;
      top: 30%;
      bottom: auto; }
      body .reply-wrap .reply-info .reply-close {
        top: -15px;
        right: -15px; }
  video::-webkit-media-controls-panel {
    width: calc(100%); } }

a:focus {
  outline: none; }

.bottom {
  height: 100%;
  box-sizing: border-box;
  position: relative; }

.float-video {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
  z-index: 100; }
  .float-video .container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    left: 0; }
    .float-video .container .video {
      position: absolute;
      top: 4px;
      left: 4px;
      z-index: 1; }
    .float-video .container .bg {
      width: 100%;
      height: 100%; }
    .float-video .container .close {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      position: absolute;
      right: -16px;
      top: -10px;
      display: block;
      z-index: 1000; }

.mask {
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.2;
  filter: alpha(opacity=20); }

.icon-share {
  position: absolute;
  right: 40px;
  top: 40px;
  height: 42px;
  z-index: 4;
  width: 160px; }
  .icon-share .qq {
    background: url(images/qq.png) no-repeat; }
  .icon-share .zone {
    background: url(images/zone.png) no-repeat; }
  .icon-share .wb {
    background: url(images/wb.png) no-repeat; }
  .icon-share .wx {
    background: url(images/wx.png) no-repeat; }
  .icon-share .icon {
    float: right;
    height: 30px;
    margin-top: 6px;
    margin-left: 10px;
    background-size: 100% 100%;
    width: 30px; }

.logo {
  width: 203px;
  height: 106px;
  position: absolute;
  top: 5.7%;
  left: 11%;
  z-index: 2; }
  .logo img {
    border: none;
    width: 203px;
    height: 106px; }

p.ost_t, p.ost_gl {
  margin: 0; }

.two {
  display: none; }

.video-slide {
  height: 100%; }

.ab {
  width: 410.55px;
  height: 93.84px;
  margin-left: -205.275px; }

.ndxs {
  width: 457.47px;
  height: 93.84px;
  margin-left: -228.735px; }

.bb {
  width: 429.87px;
  height: 93.84px;
  margin-left: -214.935px; }

.ss {
  width: 407.1px;
  height: 93.84px;
  margin-left: -203.55px; }

.ws {
  width: 458.16px;
  height: 93.84px;
  margin-left: -229.08px; }

.zy {
  width: 355.35px;
  height: 93.84px;
  margin-left: -177.675px; }

.wa {
  bottom: 60px;
  position: absolute;
  left: 50%;
  z-index: 100; }

.logo-2 {
  height: 32.2;
  width: 121.1px;
  position: absolute;
  z-index: 2;
  top: 11%;
  left: 12.3%; }

.play {
  height: 110.6px;
  width: 110.6px;
  position: absolute;
  cursor: pointer;
  z-index: 2;
  left: 50%;
  margin-left: -55.3px;
  top: 50%;
  margin-top: -55.3px; }

/*
 * Swiper 2.7.6
 * Mobile touch slider and framework with hardware accelerated transitions
 *
 * http://www.idangero.us/sliders/swiper/
 *
 * Copyright 2010-2015, Vladimir Kharlampidi
 * The iDangero.us
 * http://www.idangero.us/
 *
 * Licensed under GPL &amp; MIT
 *
 * Released on: February 11, 2015
*/
/* ===============================================================
Basic Swiper Styles 
================================================================*/
.swiper-container {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  direction: ltr;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  /* Fix of Webkit flickering */
  z-index: 1; }

.swiper-wrapper {
  position: relative;
  width: 100%;
  -webkit-transition-property: -webkit-transform, left, top;
  -webkit-transition-duration: 0s;
  -webkit-transform: translate3d(0px, 0, 0);
  -webkit-transition-timing-function: ease;
  -moz-transition-property: -moz-transform, left, top;
  -moz-transition-duration: 0s;
  -moz-transform: translate3d(0px, 0, 0);
  -moz-transition-timing-function: ease;
  -o-transition-property: -o-transform, left, top;
  -o-transition-duration: 0s;
  -o-transform: translate3d(0px, 0, 0);
  -o-transition-timing-function: ease;
  -o-transform: translate(0px, 0px);
  -ms-transition-property: -ms-transform, left, top;
  -ms-transition-duration: 0s;
  -ms-transform: translate3d(0px, 0, 0);
  -ms-transition-timing-function: ease;
  -webkit-transition-property: left, top, -webkit-transform;
  transition-property: left, top, -webkit-transform;
  transition-property: transform, left, top;
  transition-property: transform, left, top, -webkit-transform;
  transition-duration: 0s;
  transform: translate3d(0px, 0, 0);
  transition-timing-function: ease;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box; }

.swiper-free-mode &gt; .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -ms-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto; }

.swiper-slide {
  float: left;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box; }

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
  -ms-touch-action: pan-y; }

.swiper-wp8-vertical {
  -ms-touch-action: pan-x; }

/* ===============================================================
Your custom styles, here you need to specify container's and slide's
sizes, pagination, etc.
================================================================*/
.swiper-container {
  /* Specify Swiper's Size: */
  /*width:200px;
  height: 100px;*/ }

.swiper-slide {
  /* Specify Slides's Size: */
  /*width: 100%;
  height: 100%;*/ }

.swiper-slide-active {
  /* Specific active slide styling: */ }

.swiper-slide-visible {
  /* Specific visible slide styling: */ }

/* ===============================================================
Pagination Styles
================================================================*/
.swiper-pagination-switch {
  /* Stylize pagination button: */ }

.swiper-active-switch {
  /* Specific active button style: */ }

.swiper-visible-switch {
  /* Specific visible button style: */ }

.swiper-container-v {
  height: 100%;
  width: 100%; }
  .swiper-container-v .swiper-wrapper {
    height: 100%; }
    .swiper-container-v .swiper-wrapper .swiper-slide {
      height: 100%;
      position: relative; }

.pagination {
  position: absolute;
  z-index: 20;
  text-align: center;
  bottom: 8%;
  width: 100%;
  height: 20px; }

.swiper-pagination-switch {
  display: inline-block;
  width: 12px;
  height: 12px;
  cursor: pointer;
  vertical-align: middle; }

.small-dot {
  display: inline-block;
  margin: 0 4px;
  vertical-align: middle; }

.swiper-active-switch {
  width: 20px;
  height: 20px; }

@-webkit-keyframes moveRight {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(10px);
            transform: translateX(10px); } }

@keyframes moveRight {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(10px);
            transform: translateX(10px); } }

@-webkit-keyframes moveLeft {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px); } }

@keyframes moveLeft {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px); } }

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box; }

html,
body {
  font-family: "Microsoft YaHei"; }

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

body {
  line-height: 1; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

a {
  text-decoration: none; }

.bottom {
  background: #1e1e1e; }
  .bottom.first-slide .nav-menu {
    left: -100px;
    -webkit-transition: all 300ms;
    transition: all 300ms; }
  .bottom.first-slide .video-control {
    bottom: -70px;
    -webkit-transition: all 300ms;
    transition: all 300ms; }
  .bottom.mouseenter .nav-menu {
    left: 0;
    -webkit-transition: all 300ms;
    transition: all 300ms; }
  .bottom.mouseenter .video-control {
    bottom: 40px;
    -webkit-transition: all 300ms;
    transition: all 300ms; }

.slide-1 {
  width: 100%;
  background: url(./img/slide1-bg.png) center no-repeat;
  background-size: cover;
  overflow: hidden; }
  .slide-1:hover .video-control {
    display: block; }
  .slide-1 .video-bg {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover; }
  .slide-1 .video-play {
    display: none; }
  .slide-1 .slide1-logo {
    position: absolute;
    z-index: 99;
    top: 40px;
    right: 50px;
    width: 300px;
    height: 106.5px;
    margin: 0;
    display: none; }
  .slide-1 .slide1-info {
    position: absolute;
    top: 160px;
    right: 48px;
    width: 300px;
    font-size: 20px;
    letter-spacing: 9px;
    margin: 0;
    z-index: 99;
    color: white;
    font-family: 'Microsoft YaHei'; }
  .slide-1 .video-control {
    position: absolute;
    bottom: 35px;
    left: 50%;
    right: 0;
    margin: 0 auto 0 -200px;
    width: 400px;
    color: #fff;
    letter-spacing: 3px;
    height: 60px; }
    .slide-1 .video-control .prev-video {
      position: absolute;
      left: 0;
      top: 0;
      height: 55px;
      width: 55px;
      background: url(./img/prev-btn.png) center no-repeat;
      background-size: 100%;
      cursor: pointer;
      -webkit-transition: all 300ms;
      transition: all 300ms; }
      .slide-1 .video-control .prev-video:hover {
        -webkit-transform: scale(1.1);
                transform: scale(1.1); }
    .slide-1 .video-control .prev-text {
      position: absolute;
      top: 0;
      left: 90px;
      line-height: 55px;
      font-size: 18px; }
    .slide-1 .video-control .next-text {
      position: absolute;
      top: 0;
      right: 90px;
      line-height: 55px;
      font-size: 18px; }
    .slide-1 .video-control .blood {
      position: absolute;
      top: 10px;
      left: 180px;
      bottom: 0;
      height: 39px;
      width: 29px;
      margin: auto 0;
      background: url(./img/blood.png) center no-repeat;
      background-size: 100%; }
    .slide-1 .video-control .next-video {
      position: absolute;
      right: 0;
      top: 0;
      height: 55px;
      width: 55px;
      background: url(./img/next-btn.png) center no-repeat;
      background-size: 100%;
      cursor: pointer;
      -webkit-transition: all 300ms;
      transition: all 300ms; }
      .slide-1 .video-control .next-video:hover {
        -webkit-transform: scale(1.1);
                transform: scale(1.1); }

.slide-2 {
  width: 100%;
  background: url(./img/slide2-bg.png) center no-repeat;
  background-size: 100% 100%;
  background-size: cover; 
}
  .slide-2 .slide2-logo {
    position: absolute;
    z-index: 5;
    top: 9%;
    left: 227px;
    width: auto;
    height: 40%; }
  .slide-2 .slide2-info {
    position: absolute;
    z-index: 5;
    top: 55%;
    left: 369px;
    width: 420px;
    height: 40%;
    font-size: 24px;
    line-height: 48px;
    color: #8c9db1 !important;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-delay: 1s;
            animation-delay: 1s; }
  .slide-2 .slide2-text {
    position: absolute;
    right: 248px;
    width: auto;
    height: 80%;
    top: 9%;
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
    -webkit-animation-delay: 1.5s;
            animation-delay: 1.5s; }
  .slide-2 .img-tips {
    position: absolute;
    width: 100px;
    right: 248px;
    height: 80%;
    top: 9%; }
    .slide-2 .img-tips img {
      display: none;
      position: absolute;
      -webkit-animation: imgShow 200ms linear both 3;
              animation: imgShow 200ms linear both 3;
      box-sizing: border-box;
      border: 1px solid transparent; }
    .slide-2 .img-tips .img-tip1 {
      height: 49%;
      width: auto;
      top: 0;
      right: 0; }
    .slide-2 .img-tips .img-tip2 {
      height: 40.46%;
      width: auto;
      top: 31.6%;
      left: 0; }
    .slide-2 .img-tips .img-tip3 {
      height: 40.65%;
      width: auto;
      bottom: -8.6%;
      right: 0; }
  .slide-2 .slide2-more-wrap {
    cursor: pointer; }
    .slide-2 .slide2-more-wrap:hover .slide2-more-logo {
      -webkit-animation: imgShow2 300ms infinite linear both;
              animation: imgShow2 300ms infinite linear both;
      -webkit-animation-delay: 0;
              animation-delay: 0; }
  .slide-2 .slide2-more-logo {
    position: absolute;
    z-index: 5;
    right: 95px;
    top: 50%;
    width: 60px;
    height: 60px;
    margin-top: -30px;
    background: url(./img/next-logo.png) no-repeat center;
    background-size: 80%; }
  .slide-2 .slide2-more-text {
    position: absolute;
    right: 42px;
    width: 24px;
    height: 284px;
    margin-top: -142px;
    top: 50%;
    font-size: 24px;
    line-height: 72px;
    color: #fff; }

.slide-3 {
  width: 100%;
  background: url(./img/slide3-bg.png) center no-repeat;
  background-size: 100% 100%;
  background-size: cover; }
  .slide-3 .container {
    width: 1920px;
    height: 930px;
    top: 50%;
    margin-top: -465px; }
  .slide-3 .slide3-logo {
    position: absolute;
    top: 50px;
    left: 0;
    width: 937px; }
  .slide-3 .case {
    cursor: pointer;
    background: url(./img/temp-case.png) no-repeat center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-animation-delay: 1s;
            animation-delay: 1s;
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
    -webkit-transition: all 500ms;
    transition: all 500ms;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./img/temp-case.png',sizingMethod='scale');
    -webkit-transform: scale(1);
            transform: scale(1);
    background-size: cover;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%); }
    .slide-3 .case:hover {
      -webkit-filter: none;
      -moz-filter: none;
      -ms-filter: none;
      -o-filter: none;
      filter: none;
      -webkit-filter: none;
      filter: none;
      -webkit-transform: scale(1.02);
              transform: scale(1.02); }
  .slide-3 .slide3-case1 {
    position: absolute;
    top: 50px;
    left: 963px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case2 {
    position: absolute;
    top: 50px;
    left: 1301px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case3 {
    position: absolute;
    top: 335px;
    left: 284px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case4 {
    position: absolute;
    top: 335px;
    left: 622px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case5 {
    position: absolute;
    top: 335px;
    left: 960px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case6 {
    position: absolute;
    top: 335px;
    left: 1298px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case7 {
    position: absolute;
    top: 620px;
    left: 284px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case8 {
    position: absolute;
    top: 620px;
    left: 622px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case9 {
    position: absolute;
    top: 620px;
    left: 960px;
    width: 312px;
    height: 260px; }
  .slide-3 .slide3-case-more {
    position: absolute;
    top: 620px;
    left: 1298px;
    width: 312px;
    height: 260px;
    background: url(./img/slide3-case-more.png) no-repeat center;
    -webkit-animation-duration: 3s;
            animation-duration: 3s;
    -webkit-animation-delay: 2s;
            animation-delay: 2s; }

.slide-4 {
  width: 100%;
  background: url(./img/slide4-bg.png) center -20px no-repeat;
  background-size: 100% 100%;
  background-size: cover; }
  .slide-4 .slide4-member-wrap {
    position: absolute;
    width: 0;
    height: 60%;
    top: 25%;
    left: 0;
    *left: 50%;
    /* ie7 hack */
    right: 0;
    margin: 0 auto; }
  .slide-4 .member {
    box-sizing: border-box;
    position: relative;
    width: 230px;
    -webkit-animation-duration: .5s;
            animation-duration: .5s; }
    .slide-4 .member:hover .member-img {
      -webkit-transform: scale(1.05);
              transform: scale(1.05); }
    .slide-4 .member:hover .member-name,
    .slide-4 .member:hover .member-text {
      color: #fff !important; }
    .slide-4 .member .member-img {
      width: 230px;
      height: 230px;
      -webkit-transition: all 400ms;
      transition: all 400ms;
      -webkit-transform: scale(1);
              transform: scale(1); }
    .slide-4 .member .member-name {
      margin-top: 10px;
      margin-left: 20px;
      width: 80px;
      line-height: 30px;
      font-size: 24px;
      color: #8C9DB1 !important;
      font-weight: bold;
      -webkit-transition: all 400ms;
      transition: all 400ms; }
    .slide-4 .member .member-text {
      margin-top: 10px;
      width: 190px;
      margin-left: 20px;
      font-size: 14px;
      line-height: 32px;
      color: #8C9DB1 !important;
      -webkit-transition: all 400ms;
      transition: all 400ms; }
    .slide-4 .member .member-info {
      margin-top: 10px;
      margin-left: 20px;
      font-size: 18px;
      color: #fff !important;
      width: 190px; }
  .slide-4 .slide4-member1 {
    position: absolute;
    top: 139px;
    left: -840px;
    width: 232px;
    height: 427px;
    -webkit-animation-delay: .5s;
            animation-delay: .5s; }
  .slide-4 .slide4-member2 {
    position: absolute;
    top: 0;
    left: -560px;
    width: 232px;
    height: 427px;
    -webkit-animation-delay: 1s;
            animation-delay: 1s; }
  .slide-4 .slide4-member3 {
    position: absolute;
    top: 213px;
    left: -280px;
    width: 232px;
    height: 427px;
    -webkit-animation-delay: 1.5s;
            animation-delay: 1.5s; }
  .slide-4 .slide4-member4 {
    position: absolute;
    top: 139px;
    left: 7px;
    width: 232px;
    height: 427px;
    -webkit-animation-delay: 2s;
            animation-delay: 2s; }
  .slide-4 .slide4-member5 {
    position: absolute;
    top: 0;
    left: 300px;
    width: 232px;
    height: 427px;
    -webkit-animation-delay: 2.5s;
            animation-delay: 2.5s; }
  .slide-4 .slide4-member6 {
    position: absolute;
    top: 217px;
    left: 590px;
    width: 232px;
    height: 427px;
    -webkit-animation-delay: 3s;
            animation-delay: 3s; }
  .slide-4 .page-control {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    margin: 0 auto;
    color: #fff;
    z-index: 99;
    *left: 50%;
    *margin-left: -172px; }

.slide-5 {
  width: 100%;
  background: #111 url(./img/slide5-bg.png) center -30px no-repeat;
  background-size: 100% 100%;
  background-size: cover;
  position: relative; }
  .slide-5 .container {
    height: 55%;
    width: 0;
    margin: 0 auto;
    left: 0;
    *left: 50%;
    /* ie7 hack */
    right: 0;
    top: 30%; }
  .slide-5 .customer {
    position: absolute;
    width: 267px;
    height: 308px;
    line-height: 308px;
    text-align: center;
    background: url(./img/slide5-customer-bg.png) center no-repeat;
    background-size: auto 100%;
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
    vertical-align: middle;
    display: table-cell; }
    .slide-5 .customer .customer-logo {
      max-width: 180px;
      max-height: 180px;
      -webkit-transition: all 500ms;
      transition: all 500ms;
      vertical-align: middle;
      *position: absolute;
      *top: 30%;
      *left: 20%; }
    .slide-5 .customer:hover .customer-logo {
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }
  .slide-5 .customer1 {
    top: 0;
    left: -713px; }
  .slide-5 .customer2 {
    top: 0;
    left: -420px; }
  .slide-5 .customer3 {
    top: 0;
    left: -124px; }
  .slide-5 .customer4 {
    top: 0;
    left: 168px; }
  .slide-5 .customer5 {
    top: 0;
    left: 466px; }
  .slide-5 .customer6 {
    top: 260px;
    left: -570px; }
  .slide-5 .customer7 {
    top: 260px;
    left: -274px; }
  .slide-5 .customer8 {
    top: 260px;
    left: 18px; }
  .slide-5 .customer9 {
    top: 260px;
    left: 316px; }
    .slide-5 .customer9 a span {
      position: absolute;
      left: 50%;
      width: 160px;
      margin-left: -70px;
      text-align: left;
      bottom: 80px;
      padding-left: 25px;
      font-size: 12px;
      color: #666;
      height: 20px;
      line-height: 26px;
      background: url(./img/link.png) no-repeat 0 center;
      background-size: auto 16px; }
  .slide-5 .page-control {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    margin: 0 auto;
    color: #fff;
    z-index: 99;
    *left: 50%;
    *margin-left: -172px; }

.slide-6 {
  width: 100%;
  position: relative;
  background: #111 url(./img/map-bg.jpg) center no-repeat;
  background-size: cover; }
  .slide-6 .slide6-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -99; }
  .slide-6 .map-wrap {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 9;
    overflow: hidden;
    background: #111 url(./img/map-bg.jpg) center no-repeat;
    background-size: cover; }
    .slide-6 .map-wrap #allmap {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      bottom: -250px;
      width: 100%; }
  .slide-6 .slide6-company-info {
    position: absolute;
    top: 64px;
    left: 607px;
    width: 616px;
    height: 523px;
    background: #313944;
    color: #fff;
    border-radius: 12px;
    z-index: 10; }
    .slide-6 .slide6-company-info .slide6-company-title {
      position: absolute;
      top: 20px;
      left: 20px;
      height: 100px;
      line-height: 100px;
      font-size: 30px;
      padding-left: 100px;
      background: url(./img/slide6-logo.png) left center no-repeat;
      background-size: 18%; }
    .slide-6 .slide6-company-info .slide6-company-item {
      position: absolute;
      top: 130px;
      left: 20px; }
      .slide-6 .slide6-company-info .slide6-company-item li {
        margin: 20px 0;
        font-size: 22px; }

.page-control {
  position: relative;
  width: 345px;
  height: 55px;
  margin: 70px auto 0;
  letter-spacing: 2px; }
  .page-control .prev-btn {
    position: absolute;
    left: 0;
    top: 0;
    height: 55px;
    width: 55px;
    background: url(./img/prev-btn.png) center no-repeat;
    background-size: 100%;
    cursor: pointer;
    -webkit-transition: all 300ms;
    transition: all 300ms; }
    .page-control .prev-btn:hover {
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }
  .page-control .last-text {
    position: absolute;
    top: 0;
    left: 86px;
    line-height: 55px;
    font-size: 18px; }
  .page-control .next-text {
    position: absolute;
    top: 0;
    right: 86px;
    line-height: 55px;
    font-size: 18px; }
  .page-control .blood {
    position: absolute;
    top: 0;
    left: 50%;
    right: 0;
    bottom: 0;
    height: 39px;
    width: 29px;
    margin: 10px auto auto -14.5px;
    background: url(./img/blood.png) center no-repeat;
    background-size: 100%; }
  .page-control .next-btn {
    position: absolute;
    right: 0;
    top: 0;
    height: 55px;
    width: 55px;
    background: url(./img/next-btn.png) center no-repeat;
    background-size: 100%;
    cursor: pointer;
    -webkit-transition: all 300ms;
    transition: all 300ms; }
    .page-control .next-btn:hover {
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }

.nav-menu {
  position: absolute;
  z-index: 999;
  top: 50%;
  height: 246px;
  margin-top: -123px;
  left: 0;
  width: 33px;
  background: #12141A;
  line-height: 40px;
  zoom: 1; }
  .nav-menu .list {
    color: #60A8D6 !important;
    font-size: 14px;
    width: 33px;
    height: 40px;
    overflow: hidden;
    line-height: 40px;
    padding: 0 4px;
    margin-bottom: 1px;
    cursor: pointer;
    list-style-type: none; }
    .nav-menu .list:hover, .nav-menu .list.active {
      width: 94px;
      border-right: 4px solid #E7BE2A;
      color: #12141A !important;
      background: #60A8D6; }
      .nav-menu .list:hover span, .nav-menu .list.active span {
        color: #12141A !important; }
    .nav-menu .list span {
      display: inline-block;
      padding-right: 10px;
      color: #60A8D6 !important; }

.container {
  position: absolute;
  width: 100%;
  top: 0;
  bottom: 0; }

@-webkit-keyframes imgShow {
  0% {
    opacity: 1;
    border: 1px solid transparent; }
  50% {
    opacity: 0.6;
    border: 1px solid #fff;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.8); }
  100% {
    opacity: 1;
    border: 1px solid transparent; } }

@keyframes imgShow {
  0% {
    opacity: 1;
    border: 1px solid transparent; }
  50% {
    opacity: 0.6;
    border: 1px solid #fff;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.8); }
  100% {
    opacity: 1;
    border: 1px solid transparent; } }

@-webkit-keyframes imgShow2 {
  0% {
    opacity: 1; }
  50% {
    opacity: 0.6;
    -webkit-transform: scale(1.1);
            transform: scale(1.1); }
  100% {
    opacity: 1; } }

@keyframes imgShow2 {
  0% {
    opacity: 1; }
  50% {
    opacity: 0.6;
    -webkit-transform: scale(1.1);
            transform: scale(1.1); }
  100% {
    opacity: 1; } }

.bottom:hover &gt; .nav-menu {
  display: block; }

.mobile-body .bottom .nav-menu {
  left: 0;
  top: 0;
  margin-top: 0;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
  -webkit-transform-origin: left top;
          transform-origin: left top; }

.mobile-body .bottom .video-control {
  bottom: 10px;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom; }

.mobile-body .bottom .slide-1 .video-bg {
  position: absolute;
  top: 50%;
  left: 0;
  height: auto;
  width: 100%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  -o-object-fit: cover;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  box-shadow: 0 0 20px #000;
  object-fit: cover; }

.mobile-body .bottom .slide-1 .video-play {
  display: block;
  position: absolute;
  width: 80px;
  height: 80px;
  margin: auto;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border: 4px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  z-index: 100; }
  .mobile-body .bottom .slide-1 .video-play:hover, .mobile-body .bottom .slide-1 .video-play:active {
    border: 4px solid rgba(255, 255, 255, 0.95); }
  .mobile-body .bottom .slide-1 .video-play:after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-20%, -50%) scale(1, 0.8);
            transform: translate(-20%, -50%) scale(1, 0.8);
    border: 20px solid transparent;
    border-left-color: rgba(255, 255, 255, 0.9); }

.mobile-body .bottom .slide-1 .slide1-logo, .mobile-body .bottom .slide-1 .slide1-info {
  -webkit-transform: scale(0.4) translate(50px, -50px);
          transform: scale(0.4) translate(50px, -50px);
  -webkit-transform-origin: right top;
          transform-origin: right top; }

.mobile-body .bottom .slide-1 .slide1-info {
  -webkit-transform: scale(0.4) translate(50px, -200px);
          transform: scale(0.4) translate(50px, -200px); }

.mobile-body .bottom .slide-2 .slide2-logo {
  left: 50px;
  top: 20px;
  height: 20%; }

.mobile-body .bottom .slide-2 .slide2-info {
  left: 50px;
  top: 25%;
  width: 400px;
  -webkit-transform: scale(0.6);
          transform: scale(0.6);
  -webkit-transform-origin: left top;
          transform-origin: left top;
  font-size: 18px;
  line-height: 40px; }

.mobile-body .bottom .slide-2 .img-tips {
  right: 100px;
  top: 52%;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
  -webkit-transform-origin: right top;
          transform-origin: right top; }

.mobile-body .bottom .slide-2 .slide2-more-wrap {
  position: absolute;
  right: 0;
  bottom: 20%;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
  -webkit-transform-origin: right top;
          transform-origin: right top; }

.mobile-body .bottom .slide-2 .slide2-more-logo {
  right: 85px; }

.mobile-body .bottom .slide-3 .container {
  width: 100%;
  height: 100%;
  top: 0;
  margin-top: 0; }

.mobile-body .bottom .slide-3 .slide3-logo {
  top: 10px;
  width: 280px; }

.mobile-body .bottom .slide-3 .case {
  width: 120px;
  height: 85px; }

.mobile-body .bottom .slide-3 .slide3-case1 {
  top: 95px;
  left: auto;
  right: 50%;
  -webkit-transform: translate(-5px, 0);
          transform: translate(-5px, 0); }

.mobile-body .bottom .slide-3 .slide3-case2 {
  top: 95px;
  right: auto;
  left: 50%;
  -webkit-transform: translate(5px, 0);
          transform: translate(5px, 0); }

.mobile-body .bottom .slide-3 .slide3-case3 {
  top: 185px;
  left: auto;
  right: 50%;
  -webkit-transform: translate(-5px, 0);
          transform: translate(-5px, 0); }

.mobile-body .bottom .slide-3 .slide3-case4 {
  top: 185px;
  right: auto;
  left: 50%;
  -webkit-transform: translate(5px, 0);
          transform: translate(5px, 0); }

.mobile-body .bottom .slide-3 .slide3-case5 {
  top: 275px;
  left: auto;
  right: 50%;
  -webkit-transform: translate(-5px, 0);
          transform: translate(-5px, 0); }

.mobile-body .bottom .slide-3 .slide3-case6 {
  top: 275px;
  right: auto;
  left: 50%;
  -webkit-transform: translate(5px, 0);
          transform: translate(5px, 0); }

.mobile-body .bottom .slide-3 .slide3-case7 {
  top: 365px;
  left: auto;
  right: 50%;
  -webkit-transform: translate(-5px, 0);
          transform: translate(-5px, 0); }

.mobile-body .bottom .slide-3 .slide3-case8, .mobile-body .bottom .slide-3 .slide3-case9 {
  display: none !important; }

.mobile-body .bottom .slide-3 .slide3-case-more {
  top: 369px;
  width: 120px;
  height: 85px;
  left: 50%;
  -webkit-transform: translate(5px, -3px);
          transform: translate(5px, -3px);
  background-size: 100%; }

.mobile-body .bottom .slide-4 {
  background-image: url(./img/slide4-bg.jpg); }
  .mobile-body .bottom .slide-4:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 300px;
    background: url(./img/slide4-title.png) center 10px no-repeat;
    background-size: 90% auto; }
  .mobile-body .bottom .slide-4 .container {
    width: 320px;
    left: 0;
    right: 0;
    margin: auto; }
  .mobile-body .bottom .slide-4 .slide4-member-wrap {
    width: 100%;
    top: 20%;
    left: 0; }
    .mobile-body .bottom .slide-4 .slide4-member-wrap .member {
      height: 160px;
      width: 90px; }
      .mobile-body .bottom .slide-4 .slide4-member-wrap .member .member-img {
        width: 100%;
        height: auto; }
      .mobile-body .bottom .slide-4 .slide4-member-wrap .member .member-name {
        width: 100%;
        font-size: 12px;
        margin-left: 0;
        margin-top: 2px;
        line-height: 20px; }
      .mobile-body .bottom .slide-4 .slide4-member-wrap .member .member-text {
        width: 200%;
        font-size: 12px;
        margin-left: 0;
        margin-top: 0;
        -webkit-transform: scale(0.5);
                transform: scale(0.5);
        -webkit-transform-origin: left top;
                transform-origin: left top;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden; }
      .mobile-body .bottom .slide-4 .slide4-member-wrap .member .member-info {
        font-size: 12px;
        margin-left: 0;
        margin-top: -40px; }
    .mobile-body .bottom .slide-4 .slide4-member-wrap .slide4-member1 {
      top: 0;
      left: 10px; }
    .mobile-body .bottom .slide-4 .slide4-member-wrap .slide4-member2 {
      top: 0;
      left: 110px; }
    .mobile-body .bottom .slide-4 .slide4-member-wrap .slide4-member3 {
      top: 0;
      left: 210px; }
    .mobile-body .bottom .slide-4 .slide4-member-wrap .slide4-member4 {
      top: 170px;
      left: 10px; }
    .mobile-body .bottom .slide-4 .slide4-member-wrap .slide4-member5 {
      top: 170px;
      left: 110px; }
    .mobile-body .bottom .slide-4 .slide4-member-wrap .slide4-member6 {
      top: 170px;
      left: 210px; }
  .mobile-body .bottom .slide-4 .page-control {
    bottom: 10px;
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom; }

.mobile-body .bottom .slide-5 {
  background-image: url(./img/slide5-bg.jpg);
  background-position: center 0; }
  .mobile-body .bottom .slide-5:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 200px;
    background: url(./img/slide5-title.png) center 20px no-repeat;
    background-size: 90% auto; }
  .mobile-body .bottom .slide-5 .container {
    width: 320px;
    top: 16%; }
    .mobile-body .bottom .slide-5 .container .customer {
      width: 106.8px;
      height: 123.2px;
      line-height: 123.2px;
      -webkit-transform: translate(15px, 0);
              transform: translate(15px, 0); }
      .mobile-body .bottom .slide-5 .container .customer .customer-logo {
        max-width: 75px;
        max-height: 75px; }
      .mobile-body .bottom .slide-5 .container .customer.customer1 {
        left: 10px; }
      .mobile-body .bottom .slide-5 .container .customer.customer2 {
        left: 120px; }
      .mobile-body .bottom .slide-5 .container .customer.customer3 {
        left: 65px;
        top: 96px; }
      .mobile-body .bottom .slide-5 .container .customer.customer4 {
        left: 175px;
        top: 96px; }
      .mobile-body .bottom .slide-5 .container .customer.customer5 {
        left: 10px;
        top: 192px; }
      .mobile-body .bottom .slide-5 .container .customer.customer6 {
        left: 120px;
        top: 192px; }
      .mobile-body .bottom .slide-5 .container .customer.customer7 {
        left: 65px;
        top: 288px; }
      .mobile-body .bottom .slide-5 .container .customer.customer8 {
        display: none;
        width: 0;
        height: 0;
        overflow: hidden;
        visibility: hidden; }
      .mobile-body .bottom .slide-5 .container .customer.customer9 {
        left: 175px;
        top: 288px; }

.mobile-body .bottom .slide-6 .slide6-company-info {
  -webkit-transform: scale(0.35) translate(-50%, 0);
          transform: scale(0.35) translate(-50%, 0);
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
  left: 50%;
  top: auto;
  bottom: 50%; }

body.company-body {
  background-color: #fff; }
  body.company-body .toAnimate {
    display: none; }

.mask-box {
  display: none;
  position: absolute;
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0; }
  .mask-box .mask {
    position: absolute;
    width: 100%;
    height: 100%;
    filter: Alpha(opacity=65);
    opacity: 0.65;
    background-color: #000; }
  .mask-box .mask-cont {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -20px auto auto -250px;
    width: 500px;
    height: 100px;
    background-color: #3b4151; }
    .mask-box .mask-cont .msg {
      width: 100%;
      height: 100px;
      line-height: 100px;
      color: #fff;
      text-align: center;
      font-size: 18px; }
    .mask-box .mask-cont .close {
      position: absolute;
      right: -10px;
      top: -10px;
      width: 32px;
      height: 32px;
      background: url(./img/mask-close.png) no-repeat;
      background-size: 100%;
      cursor: pointer; }

.company-container {
  position: relative;
  max-width: 1200px;
  margin: 0 auto; }

.company-header {
  position: relative;
  width: 100%;
  height: 500px;
  margin-bottom: 360px;
  background: #fff url(./img/company-top.jpg) top center no-repeat;
  background-size: cover; }
  .company-header .company-tip {
    position: absolute;
    right: 0;
    top: 230px;
    height: 80px;
    width: 545px;
    background: url(./img/company-top-tip.jpg) no-repeat;
    background-size: auto 100%;
    background-position: 0 center; }
  .company-header .company-container {
    top: 450px; }
  .company-header .company-logo {
    position: absolute;
    width: 350px;
    height: 150px;
    background: url(./img/logo-white-txt.png) no-repeat;
    background-size: 100% auto;
    left: 180px;
    top: 200px; }
  .company-header .back-to-index-btn1 {
    position: absolute;
    top: 210px;
    left: 40px;
    height: 92px;
    width: 92px;
    cursor: pointer;
    background: url("./img/back-logo1.png") center no-repeat;
    background-size: 100%; }
    .company-header .back-to-index-btn1 p {
      position: absolute;
      top: 102px;
      text-align: center;
      width: 92px;
      color: #fff;
      font-size: 16px; }
  .company-header .company-nav {
    position: relative;
    padding: 20px 30px;
    background-color: #fff; }
    .company-header .company-nav .company-left h4 {
      color: #000;
      font-size: 28px;
      font-weight: bold;
      padding-bottom: 10px; }
    .company-header .company-nav .company-left h5 {
      color: #60a8d6;
      font-size: 16px;
      padding: 5px 0 10px; }
    .company-header .company-nav .company-left .nav-wrap {
      width: 400px; }
      .company-header .company-nav .company-left .nav-wrap span {
        float: left;
        display: inline-block;
        width: 10px;
        height: 10px;
        background: url(./img/arrow10px.png) no-repeat;
        background-size: 100%; }
    .company-header .company-nav .company-left .company-introduce {
      float: left;
      height: 16px;
      color: #787878;
      font-size: 14px;
      display: inline-block; }
    .company-header .company-nav .company-left .back-to-index-btn2 {
      float: left;
      height: 16px;
      cursor: pointer;
      color: #787878;
      font-size: 14px;
      margin-left: 3px;
      display: inline-block; }
      .company-header .company-nav .company-left .back-to-index-btn2:hover {
        color: #333; }
    .company-header .company-nav .company-left .back-to-company {
      float: left;
      height: 16px;
      cursor: pointer;
      color: #787878;
      font-size: 14px;
      margin-left: 3px;
      display: inline-block;
      text-decoration: none; }
      .company-header .company-nav .company-left .back-to-company:hover {
        color: #333; }
    .company-header .company-nav .company-right {
      position: absolute;
      right: 0;
      top: 40px;
      width: 292px; }
      .company-header .company-nav .company-right h5 {
        color: #787878;
        font-size: 16px; }
      .company-header .company-nav .company-right .company-phone {
        height: 30px;
        top: 610px;
        right: 273px;
        font-size: 36px;
        font-weight: bold;
        color: #60a8d6;
        line-height: 48px; }
  .company-header .company-info {
    width: 836px;
    height: 38px;
    padding: 60px 0 10px 300px;
    font-size: 36px;
    line-height: 38px;
    text-align: left;
    font-family: 'Microsoft YaHei';
    font-weight: bold;
    box-sizing: content-box; }
  .company-header .company-text {
    margin: 0 auto;
    max-width: 1200px;
    padding: 40px 10px 0;
    text-align: center;
    font-size: 16px;
    line-height: 40px;
    letter-spacing: 2px;
    font-weight: 400; }

.company-item-wrap {
  width: 100%;
  height: 320px;
  background: #1e1e1e;
  font-size: 24px;
  color: #fff;
  position: relative; }
  .company-item-wrap .company-container {
    overflow: hidden;
    zoom: 1;
    padding: 30px 20px; }
    .company-item-wrap .company-container .company-item {
      float: left;
      width: 140px;
      margin: 0 12px;
      position: relative;
      font-size: 18px;
      -webkit-transform: scale(0.9);
              transform: scale(0.9);
      -webkit-transition: all 500ms;
      transition: all 500ms; }
      .company-item-wrap .company-container .company-item:hover {
        -webkit-transform: scale(1);
                transform: scale(1); }
  .company-item-wrap .company-item1 .company-item1-img {
    width: 140px;
    height: 200px;
    background: url("./img/company-item1.png") center no-repeat;
    background-size: 100%; }
  .company-item-wrap .company-item1 .company-item1-text {
    width: 140px;
    text-align: center;
    letter-spacing: 2px; }
  .company-item-wrap .company-item2 {
    padding-top: 40px; }
    .company-item-wrap .company-item2 .company-item2-img {
      width: 140px;
      height: 185px;
      background: url("./img/company-item2.png") center no-repeat;
      background-size: 100%; }
    .company-item-wrap .company-item2 .company-item2-text {
      position: absolute;
      top: 20px;
      width: 140px;
      text-align: center;
      letter-spacing: 2px; }
  .company-item-wrap .company-item3 .company-item3-img {
    width: 140px;
    height: 185px;
    background: url("./img/company-item3.png") center no-repeat;
    background-size: 100%; }
  .company-item-wrap .company-item3 .company-item3-text {
    width: 140px;
    text-align: center;
    letter-spacing: 2px; }
  .company-item-wrap .company-item4 {
    padding-top: 40px; }
    .company-item-wrap .company-item4 .company-item4-img {
      width: 140px;
      height: 185px;
      background: url("./img/company-item4.png") center no-repeat;
      background-size: 100%; }
    .company-item-wrap .company-item4 .company-item4-text {
      position: absolute;
      top: 20px;
      width: 140px;
      text-align: center;
      letter-spacing: 2px; }
  .company-item-wrap .company-item5 .company-item5-img {
    width: 140px;
    height: 185px;
    background: url("./img/company-item5.png") center no-repeat;
    background-size: 100%; }
  .company-item-wrap .company-item5 .company-item5-text {
    width: 140px;
    text-align: center;
    letter-spacing: 2px; }
  .company-item-wrap .company-item6 {
    padding-top: 40px; }
    .company-item-wrap .company-item6 .company-item6-img {
      width: 140px;
      height: 185px;
      background: url("./img/company-item6.png") center no-repeat;
      background-size: 100%; }
    .company-item-wrap .company-item6 .company-item6-text {
      position: absolute;
      top: 20px;
      width: 140px;
      text-align: center;
      letter-spacing: 2px; }
  .company-item-wrap .company-item7 .company-item7-img {
    width: 140px;
    height: 185px;
    background: url("./img/company-item7.png") center no-repeat;
    background-size: 100%; }
  .company-item-wrap .company-item7 .company-item7-text {
    width: 140px;
    text-align: center;
    letter-spacing: 2px; }

.company-culture {
  position: relative;
  height: 480px;
  width: 100%; }
  .company-culture .culture-text {
    position: absolute;
    left: 0;
    top: 100px;
    width: 350px;
    height: 320px;
    background: url(./img/culture-text.png) top center no-repeat;
    background-size: 100%; }
  .company-culture .culture-img {
    position: absolute;
    top: 100px;
    right: 0;
    width: 750px;
    height: 320px;
    background: url(./img/culture-img.png) top center no-repeat;
    background-size: 100%; }

.company-vision {
  position: relative;
  width: 100%;
  height: 700px;
  background: url(./img/company-vision-bg.png) center no-repeat;
  background-size: 100%; }
  .company-vision .vision-text {
    position: absolute;
    top: 100px;
    right: 0;
    width: 614px;
    height: 500px;
    background: #60A8D6 url(./img/vision-text.png) center no-repeat;
    background-size: 100%; }
    .company-vision .vision-text .middle-text {
      position: absolute;
      font-size: 28px;
      line-height: 40px;
      font-weight: bold;
      left: 65px;
      top: 212px;
      width: 340px;
      height: 100px;
      background-color: #60A8D6; }

.company-advantage {
  position: relative;
  width: 100%;
  height: 800px;
  background: #fff url(./img/company-advantage.png) bottom center no-repeat;
  background-size: 100%; }
  .company-advantage .advantage-text {
    position: absolute;
    left: 10px;
    top: 130px;
    width: 1000px;
    height: 350px;
    background: url(./img/advantage-text.png) center no-repeat;
    background-size: 100%; }

.company-contact {
  position: relative;
  height: 700px;
  width: 100%;
  background: url(./img/company-contact-bg.png) center no-repeat;
  background-size: cover; }
  .company-contact .contact-logo {
    width: 100%;
    margin: 0 auto;
    display: block;
    padding-top: 50px; }
  .company-contact .contact-left {
    position: absolute;
    top: 210px;
    left: 0;
    width: 560px;
    height: 350px;
    background: #3b4151;
    color: #fff;
    padding: 10px 0 0 40px; }
    .company-contact .contact-left .contact-title {
      height: 90px;
      line-height: 90px;
      font-size: 24px;
      background: url("./img/slide6-logo.png") center left no-repeat;
      background-size: 17%;
      padding-left: 90px;
      padding-bottom: 10px;
      letter-spacing: 4px;
      font-family: "Microsoft YaHei"; }
    .company-contact .contact-left .contact-item {
      font-size: 20px;
      line-height: 34px;
      letter-spacing: 2px; }
  .company-contact .contact-right {
    position: absolute;
    top: 210px;
    right: 0; }
    .company-contact .contact-right .contact-name {
      position: absolute;
      top: 0;
      right: 0;
      width: 550px;
      height: 40px;
      background: #3B4151;
      font-size: 20px;
      line-height: 40px;
      color: #60a9d6; }
      .company-contact .contact-right .contact-name label {
        margin-left: 18px; }
      .company-contact .contact-right .contact-name input {
        position: absolute;
        top: 0;
        margin-left: 0;
        height: 38px;
        border: none;
        width: 460px;
        outline: none;
        background: #3B4151;
        font-size: 20px;
        line-height: 40px;
        color: #60a9d6;
        box-sizing: border-box;
        border-radius: 0; }
    .company-contact .contact-right .contact-phone {
      position: absolute;
      top: 55px;
      right: 0;
      width: 550px;
      height: 40px;
      background: #3B4151;
      font-size: 20px;
      line-height: 40px;
      color: #60a9d6; }
      .company-contact .contact-right .contact-phone label {
        margin-left: 18px; }
      .company-contact .contact-right .contact-phone input {
        position: absolute;
        top: 0;
        margin-left: 0;
        height: 38px;
        border: none;
        width: 460px;
        outline: none;
        background: #3B4151;
        font-size: 20px;
        line-height: 40px;
        color: #60a9d6;
        box-sizing: border-box;
        border-radius: 0; }
    .company-contact .contact-right .contact-mail {
      position: absolute;
      top: 110px;
      right: 0px;
      width: 550px;
      height: 40px;
      background: #3B4151;
      font-size: 20px;
      line-height: 40px;
      color: #60a9d6; }
      .company-contact .contact-right .contact-mail label {
        margin-left: 18px; }
      .company-contact .contact-right .contact-mail input {
        position: absolute;
        top: 0;
        margin-left: 0;
        height: 38px;
        border: none;
        width: 460px;
        outline: none;
        background: #3B4151;
        font-size: 20px;
        line-height: 40px;
        color: #60a9d6;
        box-sizing: border-box;
        border-radius: 0; }
    .company-contact .contact-right .contact-msg {
      position: absolute;
      top: 165px;
      right: 0px;
      width: 550px;
      height: 125px;
      background: #3B4151;
      font-size: 20px;
      line-height: 40px;
      color: #60a9d6; }
      .company-contact .contact-right .contact-msg label {
        margin-left: 18px;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 9; }
      .company-contact .contact-right .contact-msg textarea {
        box-sizing: border-box;
        position: absolute;
        top: 0;
        left: 85px;
        width: 448px;
        height: 90px;
        border: none;
        outline: none;
        background: #3B4151;
        font-size: 20px;
        padding: 15px 8px;
        color: #60a9d6;
        resize: none;
        overflow: hidden; }
    .company-contact .contact-right .contact-submit {
      position: absolute;
      top: 310px;
      right: 0;
      width: 550px;
      height: 40px;
      background: #60A9D6;
      color: #3B4151;
      font-size: 20px;
      line-height: 40px;
      text-align: center;
      letter-spacing: 20px;
      cursor: pointer; }

.reply-wrap {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  z-index: 999;
  height: 100%;
  display: none; }
  .reply-wrap .mask {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: #000;
    opacity: 0.7;
    filter: alpha(opacity=70); }
  .reply-wrap .reply-info {
    position: absolute;
    bottom: 431px;
    right: 0;
    left: 50%;
    width: 554px;
    height: 150px;
    margin-left: -277px;
    font-size: 24px; }
    .reply-wrap .reply-info p {
      background: #3b4151;
      padding: 50px 20px;
      line-height: 40px;
      text-align: center;
      color: #fff; }
    .reply-wrap .reply-info .reply-close {
      position: absolute;
      top: -20px;
      right: -20px;
      z-index: 9999;
      height: 38px;
      width: 38px;
      border-radius: 50%;
      background: #60A9D6;
      line-height: 38px;
      text-align: center;
      color: #fff;
      cursor: pointer; }

.company-foot {
  position: relative;
  width: 100%;
  height: 60px;
  background: #000;
  color: #5B5B5B;
  font-size: 18px;
  line-height: 60px;
  text-align: center; }

@media screen and (max-width: 1150px) {
  body.company-body {
    overflow-x: hidden; }
  body .company-header .company-tip {
    background-position: 80px center; }
  body .company-header .company-container .company-info {
    width: auto;
    padding: 60px 0 10px 200px; }
  body .company-item-wrap .company-container .company-item {
    width: 13%;
    margin: 0 0.6%; }
  body .company-culture {
    height: 400px; }
    body .company-culture .culture-text {
      width: 28%;
      margin: 0 1%; }
    body .company-culture .culture-img {
      width: 68%;
      margin: 0 1%; }
  body .company-vision {
    height: 500px; }
    body .company-vision .vision-text {
      top: 50px;
      right: 10px;
      zoom: 0.8; }
  body .company-advantage {
    height: 600px; }
    body .company-advantage .advantage-text {
      top: 60px;
      left: 20px;
      right: 20px;
      width: auto; }
  body .company-contact {
    overflow: hidden;
    height: auto; }
    body .company-contact .contact-left {
      position: relative;
      left: 0;
      right: 0;
      top: 0;
      -webkit-transform-origin: left top;
              transform-origin: left top;
      margin: 20px auto 0; }
    body .company-contact .contact-right {
      position: relative;
      width: 560px;
      height: 360px;
      left: 0;
      right: 0;
      top: 0;
      margin: 20px auto; }
      body .company-contact .contact-right div {
        left: 0;
        width: auto !important; } }

@media screen and (max-width: 450px) {
  body.company-body {
    overflow-x: hidden;
    min-width: auto; }
    body.company-body .company-container {
      width: 100%; }
    body.company-body .company-header {
      height: 200px;
      padding: 0 20px;
      margin-bottom: 280px; }
      body.company-body .company-header .back-to-index-btn1 {
        top: 20px;
        left: 20px;
        -webkit-transform: scale(0.5);
                transform: scale(0.5);
        -webkit-transform-origin: left top;
                transform-origin: left top; }
      body.company-body .company-header .company-logo {
        top: 30px;
        left: 100px;
        -webkit-transform: scale(0.6);
                transform: scale(0.6);
        -webkit-transform-origin: left top;
                transform-origin: left top; }
      body.company-body .company-header .company-tip {
        top: 120px;
        -webkit-transform: scale(0.4) translate(20px, 0);
                transform: scale(0.4) translate(20px, 0);
        -webkit-transform-origin: right top;
                transform-origin: right top; }
      body.company-body .company-header .company-container {
        top: 170px; }
        body.company-body .company-header .company-container .company-nav {
          padding: 10px; }
          body.company-body .company-header .company-container .company-nav .company-left {
            -webkit-transform: scale(0.6);
                    transform: scale(0.6);
            -webkit-transform-origin: left top;
                    transform-origin: left top; }
            body.company-body .company-header .company-container .company-nav .company-left h4 {
              font-size: 14px;
              padding-bottom: 0; }
            body.company-body .company-header .company-container .company-nav .company-left h5 {
              font-size: 12px; }
            body.company-body .company-header .company-container .company-nav .company-left .nav-wrap .company-introduce, body.company-body .company-header .company-container .company-nav .company-left .nav-wrap .back-to-index, body.company-body .company-header .company-container .company-nav .company-left .nav-wrap .back-to-company {
              font-size: 12px; }
          body.company-body .company-header .company-container .company-nav .company-right {
            width: 230px;
            top: 10px;
            -webkit-transform: scale(0.6);
                    transform: scale(0.6);
            -webkit-transform-origin: right top;
                    transform-origin: right top; }
            body.company-body .company-header .company-container .company-nav .company-right h5 {
              font-size: 14px; }
            body.company-body .company-header .company-container .company-nav .company-right a {
              font-size: 30px;
              line-height: 50px; }
        body.company-body .company-header .company-container .company-info {
          width: 100%;
          padding: 10px;
          font-size: 20px;
          line-height: 20px; }
        body.company-body .company-header .company-container .company-text {
          width: 100%;
          padding: 20px 10px 0;
          font-size: 12px;
          line-height: 20px; }
    body.company-body .company-item-wrap {
      height: 480px; }
      body.company-body .company-item-wrap .company-container {
        padding: 20px 10px; }
        body.company-body .company-item-wrap .company-container .company-item {
          font-size: 12px;
          margin: 0 2% 20px 4%;
          width: 27%;
          -webkit-transform: scale(1);
                  transform: scale(1);
          padding-top: 0; }
          body.company-body .company-item-wrap .company-container .company-item .company-img {
            width: 100%;
            height: 120px;
            max-width: 95px; }
          body.company-body .company-item-wrap .company-container .company-item .company-text {
            width: 100%;
            position: static; }
          body.company-body .company-item-wrap .company-container .company-item.company-item2, body.company-body .company-item-wrap .company-container .company-item.company-item5 {
            position: relative;
            top: 0; }
          body.company-body .company-item-wrap .company-container .company-item.company-item3, body.company-body .company-item-wrap .company-container .company-item.company-item6 {
            position: relative;
            top: 0; }
          body.company-body .company-item-wrap .company-container .company-item.company-item7 {
            position: relative;
            left: 50%;
            -webkit-transform: translate(-50%, 0);
                    transform: translate(-50%, 0);
            margin: 0; }
    body.company-body .company-culture .culture-text {
      top: 180px;
      width: 75%;
      background-size: 80% auto; }
    body.company-body .company-culture .culture-img {
      top: 0;
      width: 100%;
      height: 200px; }
    body.company-body .company-vision {
      height: 400px;
      background-size: cover; }
      body.company-body .company-vision .company-container {
        top: 50%; }
      body.company-body .company-vision .vision-text {
        top: 50%;
        left: 50%;
        right: auto;
        -webkit-transform: scale(0.5) translate(-50%, -50%);
                transform: scale(0.5) translate(-50%, -50%);
        -webkit-transform-origin: left top;
                transform-origin: left top;
        -webkit-animation-name: none;
                animation-name: none; }
    body.company-body .company-advantage {
      height: 300px;
      background-size: cover; }
      body.company-body .company-advantage .advantage-text {
        width: 100%;
        top: 30px;
        left: 0;
        background-position: center top;
        background-size: 95%;
        height: 200px; }
    body.company-body .company-contact {
      overflow: hidden; }
      body.company-body .company-contact .company-container {
        padding-top: 120px; }
      body.company-body .company-contact .contact-logo {
        position: absolute;
        width: 100%;
        height: auto;
        left: 0;
        top: -10px;
        -webkit-transform: scale(2);
                transform: scale(2); }
      body.company-body .company-contact .contact-left {
        position: relative;
        left: 50%;
        top: 0;
        -webkit-transform: scale(0.5) translate(-50%, 0);
                transform: scale(0.5) translate(-50%, 0);
        -webkit-transform-origin: left top;
                transform-origin: left top;
        margin: 0; }
      body.company-body .company-contact .contact-right {
        position: relative;
        height: 220px;
        top: -140px;
        left: auto;
        right: auto;
        margin: auto;
        width: auto; }
        body.company-body .company-contact .contact-right &gt; div {
          left: 10px;
          right: 10px;
          width: auto;
          line-height: 30px; }
          body.company-body .company-contact .contact-right &gt; div label {
            font-size: 12px; }
          body.company-body .company-contact .contact-right &gt; div input {
            width: auto;
            left: 60px;
            right: 0; }
          body.company-body .company-contact .contact-right &gt; div textarea {
            width: 230px;
            height: 125px;
            left: 60px;
            right: 0;
            box-sizing: border-box; }
        body.company-body .company-contact .contact-right .contact-submit {
          font-size: 14px;
          line-height: 40px; }
    body.company-body .company-foot {
      padding: 10px 0;
      height: auto;
      line-height: 26px;
      font-size: 12px; } }

.case-body {
  background: #1e1e1e;
  overflow: auto; }
  .case-body .case-header {
    position: relative;
    width: 100%;
    height: 550px;
    background: url(./img/case-header.jpg) bottom center no-repeat;
    background-size: cover; }
    .case-body .case-header .case-tip {
      position: absolute;
      right: 0;
      top: 130px;
      height: 80px;
      width: 545px;
      background: url(img/company-top-tip.jpg) no-repeat;
      background-size: auto 100%;
      background-position: 0; }
    .case-body .case-header .back-to-index-btn1 {
      position: absolute;
      top: 130px;
      left: 40px;
      height: 98px;
      width: 98px;
      cursor: pointer;
      background: url("./img/back-logo2.png") center no-repeat;
      background-size: 100%; }
      .case-body .case-header .back-to-index-btn1 p {
        position: absolute;
        top: 102px;
        text-align: center;
        width: 92px;
        color: #fff;
        font-size: 16px; }
    .case-body .case-header .case-header-container {
      position: relative;
      top: 328px;
      max-width: 1200px;
      margin: 0 auto;
      height: 153px;
      background: #fff; }
      .case-body .case-header .case-header-container .case-left {
        position: absolute;
        left: 30px;
        top: 0; }
        .case-body .case-header .case-header-container .case-left h4 {
          margin-top: 30px;
          font-size: 30px;
          color: #000;
          font-weight: bold; }
        .case-body .case-header .case-header-container .case-left h5 {
          margin-top: 10px;
          font-size: 18px;
          color: #60A8D6; }
        .case-body .case-header .case-header-container .case-left .nav-wrap {
          margin-top: 10px; }
          .case-body .case-header .case-header-container .case-left .nav-wrap span {
            float: left;
            margin-top: 2px;
            width: 10px;
            height: 10px;
            background: url(img/case-nav-logo.png) center no-repeat;
            background-size: 100%; }
          .case-body .case-header .case-header-container .case-left .nav-wrap .case-introduce {
            float: left;
            height: 16px;
            line-height: 16px;
            color: #787878;
            font-size: 14px; }
          .case-body .case-header .case-header-container .case-left .nav-wrap .back-to-index-btn2 {
            float: left;
            height: 16px;
            line-height: 16px;
            cursor: pointer;
            color: #787878;
            font-size: 14px;
            float: left;
            margin-left: 3px; }
            .case-body .case-header .case-header-container .case-left .nav-wrap .back-to-index-btn2:hover {
              color: #333; }
          .case-body .case-header .case-header-container .case-left .nav-wrap .back-to-case {
            height: 16px;
            line-height: 16px;
            cursor: pointer;
            color: #787878;
            font-size: 14px;
            float: left;
            margin-left: 3px;
            text-decoration: none; }
            .case-body .case-header .case-header-container .case-left .nav-wrap .back-to-case:hover {
              color: #333; }
      .case-body .case-header .case-header-container .case-right {
        position: absolute;
        right: 30px;
        top: 0;
        width: 292px; }
        .case-body .case-header .case-header-container .case-right h5 {
          font-size: 14px;
          color: #787878;
          text-align: left;
          margin-top: 50px; }
        .case-body .case-header .case-header-container .case-right .company-phone {
          height: 30px;
          margin-top: 30px;
          font-size: 36px;
          font-weight: bold;
          text-align: left;
          color: #60a8d6;
          line-height: 48px;
          letter-spacing: 2px; }
  .case-body .case-wrap {
    max-width: 1240px;
    margin: 0 auto;
    padding-left: 30px;
    background: #1e1e1e;
    padding-bottom: 60px; }
    .case-body .case-wrap .case-btn-menu {
      position: relative;
      height: 70px;
      width: 100%;
      padding: 0 235px;
      background: #1e1e1e; }
      .case-body .case-wrap .case-btn-menu .case-btn {
        height: 70px;
        line-height: 70px;
        text-align: center;
        font-size: 24px;
        color: #1e1e1e;
        float: left;
        background: #60A8D6; }
        .case-body .case-wrap .case-btn-menu .case-btn:hover {
          background: #DB9B13;
          cursor: pointer; }
        .case-body .case-wrap .case-btn-menu .case-btn.active {
          background: #DB9B13; }
      .case-body .case-wrap .case-btn-menu .case-btn1 {
        width: 210px; }
      .case-body .case-wrap .case-btn-menu .case-btn2 {
        position: absolute;
        left: 50%;
        margin-left: -105px;
        width: 210px; }
      .case-body .case-wrap .case-btn-menu .case-btn3 {
        width: 210px;
        float: right; }
    .case-body .case-wrap .case-content {
      position: relative;
      width: 100%;
      background: #1e1e1e;
      max-height: 1110px;
      overflow: hidden;
      margin-top: 88px; }
      .case-body .case-wrap .case-content .case {
        float: left;
        margin: 0 1% 0 1%;
        height: 290px;
        width: 23%;
        cursor: pointer; }
        .case-body .case-wrap .case-content .case .case-media {
          width: 100%;
          height: auto;
          -webkit-transition: all 300ms;
          transition: all 300ms; }
          .case-body .case-wrap .case-content .case .case-media:hover {
            -webkit-transform: scale(1.05);
                    transform: scale(1.05);
            box-shadow: 0 1px 6px #000; }
        .case-body .case-wrap .case-content .case .case-name {
          margin-top: 14px;
          width: 100%;
          text-align: left;
          font-size: 14px;
          height: 18px;
          line-height: 18px;
          color: #fff;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 1;
          overflow: hidden; }
        .case-body .case-wrap .case-content .case .case-address {
          margin-top: 8px;
          width: 100%;
          text-align: left;
          font-size: 14px;
          height: 18px;
          line-height: 18px;
          color: #fff;
          margin-bottom: 40px;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 1;
          overflow: hidden; }
    .case-body .case-wrap .case-control {
      z-index: 99;
      position: relative;
      margin: 50px auto 0;
      color: #fff; }
  .case-body .case-more {
    max-width: 1200px;
    margin: 0 auto; }
    .case-body .case-more .more-title {
      position: relative;
      margin-top: 40px;
      width: 313px;
      font-size: 20px;
      color: #60A8D6; }
    .case-body .case-more .more-wrap {
      position: relative;
      width: 100%;
      font-size: 14px;
      overflow: hidden;
      zoom: 1;
      padding-bottom: 100px; }
      .case-body .case-more .more-wrap .more-item {
        width: 575px;
        height: 40px;
        line-height: 40px;
        border-bottom: 1px dashed #fff;
        float: left;
        margin-top: 10px;
        margin-right: 20px;
        cursor: pointer;
        color: #fff;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden; }
        .case-body .case-more .more-wrap .more-item span {
          color: red;
          margin-right: 10px; }
        .case-body .case-more .more-wrap .more-item p {
          display: inline; }
        .case-body .case-more .more-wrap .more-item:hover {
          opacity: 0.7;
          -webkit-filter: opacity(70);
                  filter: opacity(70); }

.next-prev-control {
  position: absolute;
  width: 345px;
  height: 55px;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto; }
  .next-prev-control .prev-btn {
    position: absolute;
    left: 0;
    top: 0;
    height: 55px;
    width: 55px;
    background: url(./img/prev-btn.png) center no-repeat;
    background-size: 100%;
    cursor: pointer; }
  .next-prev-control .last-text {
    position: absolute;
    top: 0;
    left: 86px;
    line-height: 55px;
    font-size: 18px; }
  .next-prev-control .next-text {
    position: absolute;
    top: 0;
    right: 86px;
    line-height: 55px;
    font-size: 18px; }
  .next-prev-control .blood {
    position: absolute;
    left: 50%;
    height: 39px;
    width: 29px;
    margin-top: 10px;
    margin-left: -15px;
    background: url(./img/blood.png) center no-repeat;
    background-size: 100%; }
  .next-prev-control .next-btn {
    position: absolute;
    right: 0;
    top: 0;
    height: 55px;
    width: 55px;
    background: url(./img/next-btn.png) center no-repeat;
    background-size: 100%;
    cursor: pointer; }

@media screen and (max-width: 1150px) {
  .case-body .case-wrap {
    width: auto;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px; }
    .case-body .case-wrap .case-btn-menu {
      padding: 0 10px; }
      .case-body .case-wrap .case-btn-menu .case-btn.case-btn2 {
        margin-left: -105px; }
    .case-body .case-wrap .case-content .case {
      height: 240px; }
  .case-body .case-more .more-title {
    padding: 0 20px; }
  .case-body .case-more .more-wrap {
    padding: 0 20px 60px; }
    .case-body .case-more .more-wrap .more-item {
      width: 45%;
      margin-right: 5%; } }

@media screen and (max-width: 450px) {
  .case-body {
    overflow-x: hidden;
    min-width: auto; }
    .case-body .company-container {
      width: 100%; }
    .case-body .case-header {
      padding: 0 10px;
      height: 320px;
      overflow: hidden; }
      .case-body .case-header .case-tip {
        top: 120px;
        -webkit-transform: scale(0.5) translate(40px, 0);
                transform: scale(0.5) translate(40px, 0);
        -webkit-transform-origin: right top;
                transform-origin: right top; }
      .case-body .case-header .back-to-index-btn1 {
        top: 50px;
        left: 20px;
        -webkit-transform: scale(0.5);
                transform: scale(0.5);
        -webkit-transform-origin: left top;
                transform-origin: left top; }
      .case-body .case-header .case-header-container {
        padding: 10px;
        top: 200px;
        width: auto;
        height: 90px; }
        .case-body .case-header .case-header-container .case-left {
          left: 10px;
          -webkit-transform: scale(0.6);
                  transform: scale(0.6);
          -webkit-transform-origin: left top;
                  transform-origin: left top; }
          .case-body .case-header .case-header-container .case-left h4 {
            font-size: 14px;
            padding-bottom: 0; }
          .case-body .case-header .case-header-container .case-left h5 {
            font-size: 12px; }
          .case-body .case-header .case-header-container .case-left .nav-wrap .case-introduce, .case-body .case-header .case-header-container .case-left .nav-wrap .back-to-index, .case-body .case-header .case-header-container .case-left .nav-wrap .back-to-case {
            font-size: 12px; }
        .case-body .case-header .case-header-container .case-right {
          width: 240px;
          top: 10px;
          right: 10px;
          -webkit-transform: scale(0.6);
                  transform: scale(0.6);
          -webkit-transform-origin: right top;
                  transform-origin: right top; }
          .case-body .case-header .case-header-container .case-right h5 {
            font-size: 14px;
            margin-top: 10px; }
          .case-body .case-header .case-header-container .case-right a.company-phone {
            font-size: 30px;
            line-height: 50px; }
    .case-body .case-wrap {
      width: auto;
      padding-left: 0;
      padding-right: 0;
      padding-bottom: 20px; }
      .case-body .case-wrap .case-btn-menu {
        padding: 0 10px; }
        .case-body .case-wrap .case-btn-menu .case-btn {
          height: 50px;
          line-height: 50px;
          width: 90px;
          font-size: 14px; }
          .case-body .case-wrap .case-btn-menu .case-btn.case-btn2 {
            margin-left: -45px; }
      .case-body .case-wrap .case-content {
        margin-top: 20px;
        max-height: 1730px;
        padding: 0 3%; }
        .case-body .case-wrap .case-content .case {
          margin: 0 3%;
          width: 43.5%;
          height: 180px; }
          .case-body .case-wrap .case-content .case .case-name {
            font-size: 12px;
            margin-top: 5px;
            height: 16px;
            line-height: 16px; }
          .case-body .case-wrap .case-content .case .case-address {
            font-size: 12px;
            height: 16px;
            line-height: 16px;
            margin-top: 5px;
            margin-bottom: 10px; }
      .case-body .case-wrap .case-control {
        margin-top: 0;
        -webkit-transform: scale(0.5);
                transform: scale(0.5);
        -webkit-transform-origin: center bottom;
                transform-origin: center bottom; }
    .case-body .case-more {
      width: auto;
      padding: 0 10px; }
      .case-body .case-more .more-title {
        margin-top: 20px;
        font-size: 14px; }
      .case-body .case-more .more-wrap {
        font-size: 12px;
        padding-bottom: 50px; }
        .case-body .case-more .more-wrap .more-item {
          width: 100%;
          float: none;
          margin-top: 5px;
          height: 24px;
          line-height: 24px; }
    .case-body .company-contact {
      overflow: hidden; }
      .case-body .company-contact .company-container {
        padding-top: 120px; }
      .case-body .company-contact .contact-logo {
        position: absolute;
        width: 200%;
        height: auto;
        left: -50%;
        top: -10px; }
      .case-body .company-contact .contact-left {
        position: relative;
        left: 50%;
        top: 0;
        -webkit-transform: scale(0.5) translate(-50%, 0);
                transform: scale(0.5) translate(-50%, 0);
        -webkit-transform-origin: left top;
                transform-origin: left top;
        margin: 0; }
      .case-body .company-contact .contact-right {
        position: relative;
        height: 220px;
        top: -140px;
        left: auto;
        right: auto;
        margin: auto;
        width: auto; }
        .case-body .company-contact .contact-right &gt; div {
          left: 10px;
          right: 10px;
          width: auto;
          line-height: 30px; }
          .case-body .company-contact .contact-right &gt; div label {
            font-size: 12px; }
          .case-body .company-contact .contact-right &gt; div input {
            width: auto;
            left: 60px;
            right: 0; }
          .case-body .company-contact .contact-right &gt; div textarea {
            width: 230px;
            height: 125px;
            left: 60px;
            right: 0;
            box-sizing: border-box; }
        .case-body .company-contact .contact-right .contact-submit {
          font-size: 14px;
          line-height: 40px; }
    .case-body .company-foot {
      padding: 10px 0;
      height: auto;
      line-height: 26px;
      font-size: 12px; } }

.detail-body {
  overflow: auto;
  background: #1E1E1E;
  overflow-x: hidden; }
  .detail-body .detail-header {
    position: relative;
    width: 100%;
    height: 298px;
    top: 0;
    background: url(./img/detail-header.png) top center no-repeat;
    background-size: auto 100%;
    min-width: 1480px; }
    .detail-body .detail-header .back-to-index-btn1 {
      position: absolute;
      top: 84px;
      left: 40px;
      height: 98px;
      width: 98px;
      cursor: pointer;
      background: url("img/back-logo2.png") center no-repeat;
      background-size: 100%;
      z-index: 99; }
      .detail-body .detail-header .back-to-index-btn1 p {
        position: absolute;
        top: 102px;
        text-align: center;
        width: 92px;
        color: #fff;
        font-size: 18px; }
    .detail-body .detail-header .detail-container {
      position: relative;
      top: 70px;
      max-width: 1200px;
      margin: 0 auto;
      background: #fff;
      height: 153px; }
      .detail-body .detail-header .detail-container .detail-left {
        position: absolute;
        top: 0;
        left: 30px;
        font-size: 0;
        height: 16px; }
        .detail-body .detail-header .detail-container .detail-left h4 {
          margin-top: 30px;
          font-size: 30px;
          color: #000;
          font-weight: bold; }
        .detail-body .detail-header .detail-container .detail-left h5 {
          margin-top: 10px;
          font-size: 18px;
          color: #60A8D6; }
        .detail-body .detail-header .detail-container .detail-left .detail-nav {
          margin-top: 10px; }
          .detail-body .detail-header .detail-container .detail-left .detail-nav span {
            float: left;
            margin-top: 2px;
            width: 10px;
            height: 10px;
            background: url(img/case-nav-logo.png) center no-repeat;
            background-size: 100%; }
          .detail-body .detail-header .detail-container .detail-left .detail-nav .company-introduce {
            height: 16px;
            color: #787878;
            font-size: 14px;
            float: left; }
          .detail-body .detail-header .detail-container .detail-left .detail-nav .back-to-index-btn2 {
            height: 16px;
            cursor: pointer;
            color: #787878;
            font-size: 14px;
            float: left;
            margin-left: 3px; }
            .detail-body .detail-header .detail-container .detail-left .detail-nav .back-to-index-btn2:hover {
              color: #333; }
          .detail-body .detail-header .detail-container .detail-left .detail-nav .back-to-case {
            height: 16px;
            cursor: pointer;
            color: #787878;
            font-size: 14px;
            float: left;
            margin-left: 3px;
            text-decoration: none; }
            .detail-body .detail-header .detail-container .detail-left .detail-nav .back-to-case:hover {
              color: #333; }
          .detail-body .detail-header .detail-container .detail-left .detail-nav .back-case-name {
            height: 16px;
            cursor: pointer;
            color: #787878;
            font-size: 14px;
            display: inline-block;
            margin-left: 3px;
            text-decoration: none; }
            .detail-body .detail-header .detail-container .detail-left .detail-nav .back-case-name:hover {
              color: #333; }
      .detail-body .detail-header .detail-container .detail-right {
        position: absolute;
        right: 30px;
        top: 0;
        width: 292px; }
        .detail-body .detail-header .detail-container .detail-right h5 {
          font-size: 14px;
          color: #787878;
          text-align: left;
          margin-top: 50px; }
        .detail-body .detail-header .detail-container .detail-right .company-phone {
          text-align: left;
          margin-top: 30px;
          font-size: 36px;
          font-weight: bold;
          color: #60a8d6;
          line-height: 48px;
          letter-spacing: 2px; }
  .detail-body .case-detail {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    color: #fff; }
    .detail-body .case-detail .detail-btn-menu {
      position: relative;
      height: 154px;
      width: 100%;
      background: #1e1e1e; }
      .detail-body .case-detail .detail-btn-menu .detail-btn {
        margin-left: 360px;
        height: 75px;
        width: 210px;
        background: #60A8D6;
        font-size: 30px;
        line-height: 75px;
        text-align: center;
        float: left;
        color: #1E1E1E; }
        .detail-body .case-detail .detail-btn-menu .detail-btn:hover {
          background: #DB9B13;
          cursor: pointer; }
        .detail-body .case-detail .detail-btn-menu .detail-btn.active {
          background: #DB9B13; }
      .detail-body .case-detail .detail-btn-menu .detail-btn1 {
        display: none; }
      .detail-body .case-detail .detail-btn-menu .detail-btn2 {
        margin-left: 50px;
        display: none; }
    .detail-body .case-detail .case-single {
      position: relative;
      height: auto;
      padding-bottom: 20px; }
      .detail-body .case-detail .case-single .case-info {
        position: relative;
        padding-left: 320px; }
        .detail-body .case-detail .case-single .case-info .case-title {
          position: absolute;
          top: 0;
          left: 0;
          width: 311px;
          font-size: 24px;
          line-height: 30px;
          height: 60px;
          color: #60A8D6;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow: hidden; }
        .detail-body .case-detail .case-single .case-info .case-time {
          position: absolute;
          font-size: 14px;
          left: 0;
          top: 100px; }
        .detail-body .case-detail .case-single .case-info .case-type {
          position: absolute;
          font-size: 14px;
          left: 0;
          top: 125px; }
        .detail-body .case-detail .case-single .case-info .case-text {
          width: 840px;
          min-height: 189px;
          line-height: 24px;
          font-size: 16px;
          letter-spacing: 2px; }
          .detail-body .case-detail .case-single .case-info .case-text p:not(:first-child) {
            margin-top: 5px; }
      .detail-body .case-detail .case-single .case-media {
        position: relative;
        margin-top: 20px;
        top: 0;
        left: 0;
        max-width: 1200px;
        height: 600px;
        cursor: pointer;
        text-align: center;
        padding: 0; }
        .detail-body .case-detail .case-single .case-media .media-img {
          height: 100%;
          width: auto;
          max-width: 100%;
          display: none;
          border: 3px solid #fff;
          border-radius: 5px; }
        .detail-body .case-detail .case-single .case-media .media-video {
          height: 100%;
          display: none;
          position: relative; }
          .detail-body .case-detail .case-single .case-media .media-video #detail-video {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
            display: none;
            border: 3px solid #fff;
            border-radius: 5px;
            max-width: 1200px;
            max-height: 600px;
            min-width: 1000px;
            min-height: 480px;
           }
      .detail-body .case-detail .case-single .case-pic-group {
        position: relative;
        width: 1140px;
        height: 108px;
        margin: 10px auto;
        overflow: visible; }
        .detail-body .case-detail .case-single .case-pic-group .case-pic-container {
          width: 1140px;
          height: 108px; }
          .detail-body .case-detail .case-single .case-pic-group .case-pic-container .case-pic-wrapper .case-pic {
            width: 148px !important;
            float: left;
            margin: 0 8px;
            height: 108px !important;
            cursor: pointer;
            -webkit-filter: grayscale(100%);
            -moz-filter: grayscale(100%);
            -ms-filter: grayscale(100%);
            -o-filter: grayscale(100%);
            filter: grayscale(100%);
            -webkit-filter: gray;
                    filter: gray; }
          .detail-body .case-detail .case-single .case-pic-group .case-pic-container .case-pic-wrapper .case-pic-first {
            width: 142px !important;
            float: left;
            margin: 0 8px;
            height: 108px !important;
            cursor: pointer; }
          .detail-body .case-detail .case-single .case-pic-group .case-pic-container .case-pic-wrapper .case-pic-current {
            -webkit-filter: none;
                    filter: none;
            border: 1px solid #fff;
            box-sizing: border-box; }
        .detail-body .case-detail .case-single .case-pic-group .case-pic-prev {
          position: absolute;
          left: 50%;
          top: 35%;
          z-index: 99;
          margin-left: -600px;
          width: 24px;
          height: 34px;
          cursor: pointer;
          display: none; }
        .detail-body .case-detail .case-single .case-pic-group .case-pic-next {
          z-index: 99;
          position: absolute;
          right: 50%;
          margin-right: -600px;
          width: 24px;
          height: 34px;
          cursor: pointer;
          top: 35%;
          display: none; }
      .detail-body .case-detail .case-single .next-prev-control {
        position: relative;
        width: 345px;
        margin: 0 auto;
        height: 55px;
        margin-top: 40px; }
        .detail-body .case-detail .case-single .next-prev-control .prev-btn {
          position: absolute;
          left: 0;
          top: 0;
          height: 55px;
          width: 55px;
          background: url(./img/prev-btn.png) center no-repeat;
          background-size: 100%;
          cursor: pointer; }
        .detail-body .case-detail .case-single .next-prev-control .last-text {
          position: absolute;
          top: 0;
          left: 86px;
          line-height: 55px;
          font-size: 18px; }
        .detail-body .case-detail .case-single .next-prev-control .next-text {
          position: absolute;
          top: 0;
          right: 86px;
          line-height: 55px;
          font-size: 18px; }
        .detail-body .case-detail .case-single .next-prev-control .blood {
          position: absolute;
          height: 39px;
          left: 50%;
          width: 29px;
          margin-left: -15px;
          margin-top: 10px;
          background: url(./img/blood.png) center no-repeat;
          background-size: 100%; }
        .detail-body .case-detail .case-single .next-prev-control .next-btn {
          position: absolute;
          right: 0;
          top: 0;
          height: 55px;
          width: 55px;
          background: url(./img/next-btn.png) center no-repeat;
          background-size: 100%;
          cursor: pointer; }
    .detail-body .case-detail .case-more {
      max-width: 1200px;
      margin: 0 auto; }
      .detail-body .case-detail .case-more .more-title {
        position: relative;
        margin-top: 40px;
        width: 313px;
        font-size: 20px;
        color: #60A8D6; }
      .detail-body .case-detail .case-more .more-wrap {
        position: relative;
        width: 100%;
        overflow: hidden;
        zoom: 1;
        padding-bottom: 100px;
        font-size: 14px; }
        .detail-body .case-detail .case-more .more-wrap .more-item {
          width: 575px;
          height: 40px;
          line-height: 40px;
          border-bottom: 1px dashed #fff;
          float: left;
          margin-top: 10px;
          margin-right: 20px;
          cursor: pointer;
          color: #fff;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 1;
          overflow: hidden; }
          .detail-body .case-detail .case-more .more-wrap .more-item span {
            color: red;
            margin-right: 10px; }
          .detail-body .case-detail .case-more .more-wrap .more-item p {
            display: inline; }
          .detail-body .case-detail .case-more .more-wrap .more-item:hover {
            opacity: 0.7;
            -webkit-filter: opacity(70);
                    filter: opacity(70); }

@media screen and (max-width: 1180px) {
  .detail-body .detail-header {
    min-width: auto;
    padding-left: 170px; }
  .detail-body .case-detail .case-single .case-info .case-title, .detail-body .case-detail .case-single .case-info .case-time, .detail-body .case-detail .case-single .case-info .case-type {
    left: 10px; }
  .detail-body .case-detail .case-single .case-info .case-text {
    width: auto; }
  .detail-body .case-detail .case-single .case-media .media-video {
    margin: 0; }
    .detail-body .case-detail .case-single .case-media .media-video #detail-video {
      max-width: 900px; }
  .detail-body .case-wrap {
    width: auto;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px; }
    .detail-body .case-wrap .case-btn-menu {
      padding: 0 10px; }
      .detail-body .case-wrap .case-btn-menu .case-btn.case-btn2 {
        margin-left: -105px; }
    .detail-body .case-wrap .case-content .case {
      height: 240px; }
  .detail-body .case-more .more-title {
    padding: 0 20px; }
  .detail-body .case-more .more-wrap {
    padding: 0 20px 60px; }
    .detail-body .case-more .more-wrap .more-item {
      width: 45%;
      margin-right: 5%; } }

@media screen and (max-width: 450px) {
  .detail-body {
    overflow-x: hidden; }
    .detail-body .company-container {
      width: 100%; }
    .detail-body .detail-header {
      padding: 0 10px;
      height: 200px;
      min-width: auto;
      background-size: 300% auto;
      background-position: center bottom; }
      .detail-body .detail-header .back-to-index-btn1 {
        top: 10px;
        left: 20px;
        -webkit-transform: scale(0.5);
                transform: scale(0.5);
        -webkit-transform-origin: left top;
                transform-origin: left top; }
      .detail-body .detail-header .detail-container {
        padding: 10px;
        top: 80px;
        width: auto;
        height: 90px; }
        .detail-body .detail-header .detail-container .detail-left {
          left: 10px;
          -webkit-transform: scale(0.6);
                  transform: scale(0.6);
          -webkit-transform-origin: left top;
                  transform-origin: left top; }
          .detail-body .detail-header .detail-container .detail-left h4 {
            font-size: 14px;
            padding-bottom: 0; }
          .detail-body .detail-header .detail-container .detail-left h5 {
            font-size: 12px; }
          .detail-body .detail-header .detail-container .detail-left .nav-wrap .company-introduce, .detail-body .detail-header .detail-container .detail-left .nav-wrap .back-to-index, .detail-body .detail-header .detail-container .detail-left .nav-wrap .back-to-case {
            font-size: 12px; }
        .detail-body .detail-header .detail-container .detail-right {
          width: 240px;
          top: 10px;
          right: 0px;
          -webkit-transform: scale(0.5);
                  transform: scale(0.5);
          -webkit-transform-origin: right top;
                  transform-origin: right top; }
          .detail-body .detail-header .detail-container .detail-right h5 {
            font-size: 14px;
            margin-top: 10px; }
          .detail-body .detail-header .detail-container .detail-right a.company-phone {
            font-size: 30px;
            line-height: 50px; }
    .detail-body .case-detail {
      width: auto;
      padding-left: 0;
      padding-right: 0;
      padding-bottom: 20px; }
      .detail-body .case-detail .detail-btn-menu {
        padding: 0 10px;
        height: 80px; }
        .detail-body .case-detail .detail-btn-menu .detail-btn {
          position: absolute;
          height: 50px;
          line-height: 50px;
          width: 90px;
          font-size: 14px;
          right: 50%;
          margin-right: 20px; }
          .detail-body .case-detail .detail-btn-menu .detail-btn.detail-btn2 {
            margin-right: auto;
            margin-left: 20px;
            right: auto;
            left: 50%; }
      .detail-body .case-detail .case-single .case-info {
        padding-left: 10px;
        padding-right: 10px; }
        .detail-body .case-detail .case-single .case-info .case-title,
        .detail-body .case-detail .case-single .case-info .case-time,
        .detail-body .case-detail .case-single .case-info .case-type,
        .detail-body .case-detail .case-single .case-info .case-text {
          font-size: 14px;
          width: 100%;
          position: static;
          min-height: 10px;
          font-size: 12px;
          line-height: 16px;
          padding: 10px 0; }
          .detail-body .case-detail .case-single .case-info .case-title span,
          .detail-body .case-detail .case-single .case-info .case-time span,
          .detail-body .case-detail .case-single .case-info .case-type span,
          .detail-body .case-detail .case-single .case-info .case-text span {
            font-size: 12px !important; }
        .detail-body .case-detail .case-single .case-info .case-title {
          font-size: 16px;
          height: 30px; }
      .detail-body .case-detail .case-single .case-media {
        padding: 0 5px;
        width: 100%;
        height: 160px; }
        .detail-body .case-detail .case-single .case-media .media-video #detail-video {
          left: 0;
          right: 0;
          width: auto;
          border: 0;
          max-width: 310px;
          max-height: 200px; }
      .detail-body .case-detail .case-single .case-pic-group {
        width: 320px;
        overflow: hidden; }
        .detail-body .case-detail .case-single .case-pic-group .case-pic-container {
          width: 320px; }
          .detail-body .case-detail .case-single .case-pic-group .case-pic-container .case-pic-wrapper .case-pic {
            width: 100px !important;
            height: 80px !important; }
      .detail-body .case-detail .case-single .single-case-control {
        margin-top: 0;
        -webkit-transform: scale(0.5);
                transform: scale(0.5);
        -webkit-transform-origin: center bottom;
                transform-origin: center bottom; }
      .detail-body .case-detail .case-more {
        width: auto;
        padding: 0 10px; }
        .detail-body .case-detail .case-more .more-title {
          margin-top: 20px;
          font-size: 14px; }
        .detail-body .case-detail .case-more .more-wrap {
          font-size: 12px;
          padding-bottom: 20px; }
          .detail-body .case-detail .case-more .more-wrap .more-item {
            width: 100%;
            float: none;
            margin-top: 5px;
            height: 24px;
            line-height: 24px; }
    .detail-body .company-contact {
      overflow: hidden; }
      .detail-body .company-contact .company-container {
        padding-top: 120px; }
      .detail-body .company-contact .contact-logo {
        position: absolute;
        width: 200%;
        height: auto;
        left: -50%;
        top: -10px; }
      .detail-body .company-contact .contact-left {
        position: relative;
        left: 50%;
        top: 0;
        -webkit-transform: scale(0.5) translate(-50%, 0);
                transform: scale(0.5) translate(-50%, 0);
        -webkit-transform-origin: left top;
                transform-origin: left top;
        margin: 0; }
      .detail-body .company-contact .contact-right {
        position: relative;
        height: 220px;
        top: -140px;
        left: auto;
        right: auto;
        margin: auto;
        width: auto; }
        .detail-body .company-contact .contact-right &gt; div {
          left: 10px;
          right: 10px;
          width: auto;
          line-height: 30px; }
          .detail-body .company-contact .contact-right &gt; div label {
            font-size: 12px; }
          .detail-body .company-contact .contact-right &gt; div input {
            width: auto;
            left: 60px;
            right: 0; }
          .detail-body .company-contact .contact-right &gt; div textarea {
            width: 230px;
            height: 125px;
            left: 60px;
            right: 0;
            box-sizing: border-box; }
        .detail-body .company-contact .contact-right .contact-submit {
          font-size: 14px;
          line-height: 40px; }
    .detail-body .company-foot {
      padding: 10px 0;
      height: auto;
      line-height: 26px;
      font-size: 12px; } }
</pre></body></html>